import React, {Component, PropTypes} from 'react';

import {  Modal, Form, Input, Icon, Button } from 'antd';

const FormItem = Form.Item;
const createForm = Form.create;


export class TermForm extends Component {

  state = {
    list : [],
    formVisible: this.props.formVisible,
    formValues : this.props.formValues
  }

  constructor (props) {
    super(props);
  }

  /**
   * 弹层点击取消操作
   */
  handleFormCancel () {
    this.props.handleHide();
  }

  componentWillReceiveProps (props) {

    // console.log(props);

    if(this.state.formVisible != props.formVisible){
      this.setState({
        formVisible : props.formVisible,
        formValues : props.formValues
      });

      props.formVisible === false && props.formValues === null && this.props.form.resetFields();
      props.formVisible === true && props.formValues !== null && this.props.form.setFieldsValue(props.formValues);
    }
  }

  /**
   * 弹层点击确定操作
   */
  handleFormOk () {
    let fields = this.props.form.getFieldsValue();
    if(this.props.formValues && this.props.formValues._id){
      fields._id = this.props.formValues._id;
    }
    this.props.handleOK(fields);
  }

  render() {
    const { getFieldDecorator } = this.props.form;
    const title = this.props.formType === 'add' ? '添加分类' : '编辑分类';
    return (
      <div>
        <Modal title={title}
               visible={this.state.formVisible}
               onOk={this.handleFormOk.bind(this)}
               onCancel={this.handleFormCancel.bind(this)}>

          <Form horizontal onSubmit={this.handleSubmit}>

            <FormItem
              label="分类名称"
              hasFeedback
            >
              {getFieldDecorator('term_name', {
                rules: [{ required: true, message: '分类名称不能为空!' }],
              })(
                <Input />
              )}
            </FormItem>

            <FormItem
              label="缩略名"
              hasFeedback
            >
              {getFieldDecorator('term_slug', {
                rules: [{
                  required: true, message: '缩略名不能为空!!',
                }],
              })(
                <Input />
              )}
            </FormItem>

            <FormItem
              label="分类描述"
              hasFeedback
            >
              {getFieldDecorator('term_desc', {
                rules: [{
                  required: true, message: '描述不能为空!',
                }],
              })(
                <Input type="textarea"  />
              )}
            </FormItem>

          </Form>

        </Modal>
      </div>
    )
  }

}

export default createForm()(TermForm);